<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    {% load static %}
    <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
    <script>
        onload = function () {
            document.getElementById('add').onclick = function () {
                location.href = '/addtable/'
            }
        };
        function deltableById(id) {
            if(confirm('确认删除？')){
                location.href = '/deltableById/' +id +'/';
            }
        }
        function updatetable(id) {
            location.href='/updateTable/' + id + '/';
        }
    </script>
</head>
<body>
当前位置:<h4>餐桌管理>餐桌信息</h4>
<a href="/logout/">退出登录</a>
<button id="add" class="btn btn-primary">添加餐桌</button>
<table border="1" cellspacing="0" cellpadding="0" class="table table-bordered">
    <tr>
        <td>餐桌编号</td>
        <td>餐桌状态</td>
        <td>餐桌人数</td>
        <td>操作</td>
    </tr>
    {% for table in tablelist %}
    <tr>
        <td>{{ table.id }}</td>
        <td>{{ table.state }}</td>
        <td>{{ table.number }}</td>
        <td>
            <a href="javascript:void(0)" onclick="updatetable({{ table.id }})">修改</a>
            <a href="javascript:void(0)" onclick="deltableById({{ table.id }})">删除</a>
        </td>
    </tr>
    {% endfor %}
</table>
<br>
{% if tablelist.has_previous %}
    <a href="/showtable/?page={{ tablelist.previous_page_number }}">上一页</a>
{% endif %}
<span>当前页{{ tablelist.number }}/页</span>
{% if tablelist.has_next %}
    <a href="/showtable/?page={{ tablelist.next_page_number }}">下一页</a>
{% endif %}

</body>
</html>